// 该文件专门用于创建应用的路由器
import VueRouter from 'vue-router'
// 引入组件
import About from '../pages/About.vue'
import Home from '../pages/Home.vue'
import News from '../pages/News.vue'
import Message from '../pages/Message.vue'
import Detail from '../pages/Detail.vue'

// 创建并向外暴露路由器
const router = new VueRouter({
    routes: [
        {   
            path:'/about',
            component:About,
        },
        {
            path:'/home',
            component:Home,
            // 通过children配置子级路由
            children:[
               {
                    name:'myNews',
                    path:'news', 
                    component:News,
                    // 在需要鉴权的路由中添加鉴权信息并存放到meta中
                    meta:{isAuth:true}
               },
               {
                    path:'message', 
                    component:Message,
                    
                    meta:{isAuth:true},
                    children:[
                        {
                            name:'myDetail',
                            //使用占位符声明接收params参数
                            path:'detail',
                            component:Detail,
                        }
                    ]
               },

            ]
        }
    ]
})

// 全局前置路由守卫：初始化的时候被调用、每次路由切换之前被调用
/*
// 写法一：
router.beforeEach((to,from,next)=>{
    // to表示目的路由信息；from表来源的路由信息；next决定是否放行
    // 此处可用name或path判断：判断访问/home/news、/home/message路径下的资源是否有权限
    // 该方法有缺点：若是需要鉴权的内容有很多，则这样写很麻烦
    if(to.name === 'myNews' || to.path === '/home/message'){
        if(localStorage.getItem('account') === 'admin'){
            // 放行
            next()
        }else{
            alert('无权限')
        }
    }else{
        next()
    }
})
*/
// 写法二：
router.beforeEach((to,from,next)=>{
    // 在需要鉴权的路由上添加meta属性
    if(to.meta.isAuth){
        if(localStorage.getItem('account') === 'admin'){
            // 放行
            next()
        }else{
            alert('无权限')
        }
    }else{
        next()
    }
})
// 对外暴露路由
export default router